<route lang="json5">
{
  style: {
    navigationBarTitleText: '选择',
    // #ifdef MP-ALIPAY
    enablePullDownRefresh: false,
    'mp-alipay': {
      defaultTitle: '',
    },
    // #endif
  },
}
</route>
<template>
  <!-- <uni-indexed-list :options="list" :show-select="true" @click="bindClick" /> -->
  <view class="content">
    <trigger-indexList :list="indexLists">
      <!--            
    <template #topContent>
        <view>
            自定义索引区域顶部内容
        </view>
    </template> 
    -->
      <template #default="{ indexList }">
        <index-item v-for="(item, index) in indexList" :item="item" :key="index">
          <!-- 自定义索引头部 -->
          <!--
            <template #lineHead>
                <view class="lineHead">
                    {{item.name}}
                </view>
            </template>
            -->
          <template #lineBody>
            <view
              class="lineBody"
              v-for="(child, childIndx) in item.data"
              :key="childIndx"
              @tap="bindClick(child)"
            >
              <image class="headImg" :src="child.img" mode="aspectFill"></image>
              <view class="name">
                {{ child.name }}
              </view>
            </view>
          </template>
        </index-item>
      </template>
      <!--
    <template #bottomContent>
        <view>
            自定义索引区域底部   内容
        </view>
    </template> 
    --></trigger-indexList>
  </view>
</template>

<script lang="ts" setup>
import CustomNavbar from '@/components/CustomNavbar.vue'
import { useOrderStore } from '@/store/order'
import { myGroupMemberListApi } from '@/service/user'
import { bookListByUserIdApi } from '@/service/book'
import indexItem from '@/uni_modules/trigger-indexList_item/trigger-indexList_item.vue'
import triggerIndexList from '@/uni_modules/trigger-indexList/trigger-indexList.vue'
import { IUserInfo } from '@/types/user'

const title = 'Hello'
const indexLists = ref<any>([])

const params = defineProps<{
  type: string
  masterUserId: number
}>()
const list = ref()

onLoad(async () => {
  console.log(params.type)
  const arr = []
  if (params.type === '1') {
    const userListRes = await myGroupMemberListApi()
    console.log('userListRes', userListRes)
    for (const user of userListRes.data) {
      arr.push({ name: user.nickname, img: user.avatar, id: user.id })
    }
  } else if (params.type === '2') {
    const bookListRes = await bookListByUserIdApi(params.masterUserId)
    console.log('bookListRes', bookListRes)
    for (const book of bookListRes.data) {
      arr.push({ name: book.bookName, img: book.bookAvatar, id: book.id })
    }
  }
  indexLists.value = arr
  console.log(indexLists.value)
})
const orderRef = useOrderStore()
const bindClick = (e) => {
  if (params.type === '1') {
    orderRef.order.masterUserId = e.id
    orderRef.order.masterUserAvatar = e.img
    orderRef.order.masterUserName = e.name
  } else {
    orderRef.order.bookId = e.id
    orderRef.order.bookName = e.name
  }
  indexLists.value = []
  uni.navigateBack()
}
</script>

<style lang="scss">
.lineBody {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding: 20rpx 30rpx;
  border-bottom: 1px solid rgba(164, 164, 164, 0.2);

  .headImg {
    width: 80rpx;
    height: 80rpx;
    margin-right: 30rpx;
    border-radius: 15rpx;
  }
}
</style>
